﻿@{
    ViewData["Title"] = "菜单信息";
    ViewData["Mbx"] = "系统管理";
    Layout = "_Default";
}
@section css{
    <style>

        .fliter {
            /*width: 80%;*/
            height: 40px;
            align-items: center;
            display: flex;
            margin-bottom: 10px;
        }

        .add {
            width: 80%;
            height: 60px;
            align-items: center;
            display: flex;
        }

        .fliter .search-btn {
            margin-left: 20px;
        }

        .fliter .input-text {
            width: 200px;
        }

        .fliter .label-eq-name {
            margin-left: 20px;
            text-align: justify;
            width: 107px;
        }

        .fliter .label-eq-code {
            margin-left: 20px;
        }

        .btn-add {
            margin-left: 20px;
        }

        div.dataTables_wrapper .dataTables_length {
            float: none;
        }

        .select-box {
            width: 200px
        }

        .button-rounded {
            padding: 5px 10px;
        }
    </style>
}
@section gray{

    <div class="fliter">
        <label class="label-eq-code">菜单名称：</label>
        <input type="text" class="input-text" value="" placeholder="" id="fullName" name="fullName">
   
        <label class="label-eq-code">菜单Url：</label>
        <input type="text" class="input-text" value="" placeholder="" id="url" name="url">
        <label class="label-eq-code">状态：</label>

        <span class="select-box">
            <select class="select" size="1" name="status" id="status">
                <option value="" selected>--请选择--</option>
                <option value="1">启用</option>
                <option value="2">禁用</option>

            </select>
        </span>

        <input class="btn btn-primary radius search-btn" type="button" onclick="query()" value="&nbsp;&nbsp;搜索&nbsp;&nbsp;">
    </div>
    <div>


        <span class="l">
            <a class="btn btn-primary radius" href="javascript:;" onclick="common_add('添加菜单','/admin/functionadd','750','400')">
                <i class="Hui-iconfont">&#xe600;</i> 新增
            </a>
        </span>
    </div>
}

    <table class="table table-border table-bordered table-hover table-bg table-sort">
        <thead>
        </thead>
        <tbody>
        </tbody>
    </table>

    @section javascript{
    <script>

        $(function () {
          query()

            //全选处理
            //$("#checkAll").on('click', function() {
            //    $("tbody input:checkbox").prop("checked", $(this).prop('checked'));
            //})
        });
        function query(){
            $('.table-sort').dataTable({
                bProcessing: true, //DataTables 载入数据时，是否显示‘进度’提示
                bAutoWidth: false, //自动宽度
                bSort: false, //排序功能
                paging: true, //是否分页
                bInfo: true, //页脚信息,默认为 true
                bStateSave: false, //状态保存
                sPaginationType: "full_numbers", //分页显示样式
                //serverSide: true, //启用服务器分页
                //sAjaxSource: "/admin/functionlist", //服务端请求数据接口
                searching: true, //关闭 datatables 的搜索框
                destroy: true, //解决重新渲染问题
                iDisplayLength: 10, //每页显示数量
                ajax: {
                    url: "/admin/functionlist",
                    type: "POST",
                    contentType: "application/x-www-form-urlencoded",
                    async: false,
                    dataType: "json",
                    data: function (data) {
                        data.fullName = $('#fullName').val()
                        data.url = $('#url').val()

                        data.status = $('#status').val()
                    },
                    dataFilter: function (json) {
                        // $("#checkAll").prop("checked",false);//取消选中
                        return json;
                    }
                },

                aoColumns: [
                    // mDataProp：绑定数据属性
                    // sDefaultContent：设置默认值
                    // sClass：添加 class 属性，不懂的直接去掉
                    // sTtile：设置列标题
                    // sWidth：设置列宽度
                    // mRender：添加 html 代码或者自定义的值
                    //{
                    //    mDataProp:"id",
                    //    sWidth:"30",
                    //    sClass:"text-c",
                    //    sTitle:"<input type='checkbox' id='checkAll'>",
                    //    mRender: function(data, type, row){
                    //       return '<input type="checkbox" onclick=childclick() class="checkchild" data-oprt="' + row.fullName + '" data-ir="' + row.url + '" value="' + data + '">';
                    //    }
                    //},
                    // sTtile 设置的内容，会替换到 html thead 中的“标题”
                    { mDataProp: "js_Id", sClass: "text-c", sTitle: "编号", sDefaultContent: "", sWidth: "10%" },
                    { mDataProp: "fullName", sClass: "text-c", sTitle: "菜单名称", sDefaultContent: "", sWidth: "20%" },
                    { mDataProp: "url", sClass: "text-c", sTitle: "菜单Url", sDefaultContent: "", sWidth: "25%" },
                    { mDataProp: "pName", sClass: "text-c", sTitle: "上级菜单名称", sDefaultContent: "", sWidth: "20%" },
                    {
                        mDataProp: "status", sClass: "text-c", sTitle: "状态", sWidth: "10%",
                        mRender: function (data, type, row) {
                            if (data === 1)
                                return "正常";
                            return "禁用";
                        }
                    },
                    {
                        mDataProp: "js_Id", sClass: "text-c", sTitle: "操作", sWidth: "15%",
                        mRender: function (data, type, row) {
                            var html = "<a title=\"编辑\" href=\"javascript:;\" onclick=\"common_add('编辑菜单',\'/admin/functionadd/" + data + "','750','400')\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe6df;</i></a>";
                            if (row.status == 1) {
                                html += "<a title=\"禁用\" href=\"javascript:;\" onclick=\"delFunction('" + data + "',2)\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe631;</i></a>";
                            } else {
                                html += "<a title=\"启用\" href=\"javascript:;\" onclick=\"delFunction('" + data + "',1)\" class=\"ml-5\" style=\"text-decoration:none\"><i class=\"Hui-iconfont\">&#xe615;</i></a>";
                            }
                            return html;
                        }
                    }
                ],
                oLanguage: { //国际化配置
                    sProcessing: "正在获取数据，请稍后...",
                    sLengthMenu: "显示 _MENU_ 条",
                    sZeroRecords: "没有您要搜索的内容",
                    sInfo: "从 _START_ 到  _END_ 条记录 总记录数为 _TOTAL_ 条",
                    sInfoEmpty: "记录数为0",
                    sInfoFiltered: "(全部记录数 _MAX_ 条)",
                    sInfoPostFix: "",
                    sSearch: "从当前数据中检索： ",
                    sUrl: "",
                    oPaginate: {
                        sFirst: "首页",
                        sPrevious: "上一页",
                        sNext: "下一页",
                        sLast: "尾页"
                    }
                }
            });
        }
        function childclick() {
            // 子复选框某个不选择，全选也被取消
            if (!$(".checkchild").checked) {
                $("#checkAll").prop("checked", false);
            }
            // 子复选框全选，总复选框也被选中
            var sumall = $("input[type='checkbox'][class='checkchild']").length;
            var sumchecked = $("input[type='checkbox'][class='checkchild']:checked").length;
            if (sumall == sumchecked) {
                $("#checkAll").prop("checked", true);
            }
        }
        function delFunction(id, s) {
            popupConfirm("确定修改菜单状态嘛？", 0, function () {
                var data = { 'id': id, 'status': s };
                SubmitFormForAjax("/admin/updatestatus", data, function (data) {
                    if (data.result) {
                        popupAlert('修改成功！', 1, function () {
                            location.reload();//刷新页面
                        });
                    } else {
                        popupAlert('修改失败！', 1, function (data) { layer.close(data); });
                    }
                }, true);

            })
        }
    </script>
}

